<template>
  <el-dialog title="分支配置信息" class="gatewaysz" :visible.sync="isVisiable" width="1400px" :close-on-click-modal="false" append-to-body>
    <div class="containers" ref="content" v-if="isVisiable">
      <el-form ref="infoForm" label-width="100px" label-position="right">
        <el-row>
          <el-col :span="12">
            <el-form-item label="分支编号：">
              <el-input placeholder="分支编号" v-model="gatewayInfo.gatewayId" style="width:200px" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="分支分类：">
              <el-input placeholder="分支分类" v-model="gatewayInfo.gatewayType" style="width:200px" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <div v-for="(lineData,index) in gatewayInfo.lineData" :key="index">
          <el-row>
            <el-col :span="4">
              <el-form-item label="线路优先：">
                <el-input-number v-model="lineData.firstValue" :min="0" :max="100" style="width:100px" :disabled="gatewayInfo.gatewayType=='并行条件分支'"></el-input-number>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="节点名称：">
                <el-input placeholder="节点名称" v-model="lineData.taskName" style="width:150px" :disabled="true"></el-input>
                <el-button type="primary" icon="el-icon-plus" style="margin-left: 5px" @click="addCondition(lineData.condition)"></el-button>
              </el-form-item>
              <el-form-item label="节点编号：">
                <el-input placeholder="节点编号" v-model="lineData.taskId" style="width:150px" :disabled="true"></el-input>
              </el-form-item>
              <el-form-item label="线路编号：">
                <el-input placeholder="线路编号" v-model="lineData.lineId" style="width:150px" :disabled="true"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="14">
              <div v-for="(condition,indexs) in lineData.condition" :key="indexs" style="margin-bottom: 20px">
                连接：
                <el-select v-model="condition.connect" placeholder="请选择" :disabled="indexs==0" style="width:80px;margin-right: 10px">
                  <el-option v-for="item in [
                                            {value:'',label:'无'},
                                            {value:'&&',label:'和'},
                                            {value:'||',label:'或'},
                                        ]" :key="item.value" :label="item.label" :value="item.value"></el-option>
                </el-select>类型：
                <el-select v-model="condition.type" placeholder="请选择" style="width:100px;margin-right: 10px">
                  <el-option v-for="item in [
                                            {value:'',label:'无'},
                                            // {value:'表单参数',label:'表单参数'},
                                            // {value:'角色参数',label:'角色参数'},
                                            // {value:'职务参数',label:'职务参数'},
                                            {value:'按钮选择',label:'按钮选择'},
                                            {value:'节点来源',label:'节点来源'},
                                            // {value:'退回来源',label:'退回来源'}
                                        ]" :key="item.value" :label="item.label" :value="item.value"></el-option>
                </el-select>
                <span v-show="condition.type=='表单参数'">字段：</span>
                <el-select v-model="condition.field" placeholder="请选择" style="width:100px;margin-right: 10px" v-show="condition.type=='表单参数'">
                  <el-option v-for="item in formField" :key="item.value" :label="item.label" :value="item.value"></el-option>
                </el-select>
                <span v-show="condition.type=='表单参数'">运算：</span>
                <el-select v-model="condition.operator" placeholder="请选择" style="width:70px;margin-right: 10px" v-show="condition.type=='表单参数'">
                  <el-option v-for="item in [
                                            {value:'>',label:'>'},
                                            {value:'>=',label:'>='},
                                            {value:'==',label:'=='},
                                            {value:'!=',label:'!='},
                                            {value:'<=',label:'<='},
                                            {value:'<',label:'<'},
                                            {value:'in',label:'in'},
                                            {value:'like',label:'like'}
                                        ]" :key="item.value" :label="item.label" :value="item.value"></el-option>
                </el-select>
                <span v-show="condition.type=='表单参数'">参值：</span>
                <el-input placeholder="表单参数" v-model="condition.value" style="width:80px;margin-right: 10px" v-show="condition.type=='表单参数'"></el-input>
                <span v-show="condition.type=='角色参数'">角色：</span>
                <el-select v-model="condition.roles" placeholder="请选择" multiple style="width:362px;margin-right: 10px" v-show="condition.type=='角色参数'">
                  <el-option v-for="item in jsData" :key="item.value" :label="item.label" :value="item.value"></el-option>
                </el-select>
                <span v-show="condition.type=='职务参数'">职务：</span>
                <el-select v-model="condition.jobs" placeholder="请选择" multiple style="width:362px;margin-right: 10px" v-show="condition.type=='职务参数'">
                  <el-option v-for="item in roleData" :key="item.value" :label="item.label" :value="item.value"></el-option>
                </el-select>
                <span v-show="condition.type=='按钮选择'||condition.type=='节点来源'||condition.type=='退回来源'">节点：</span>
                <el-select v-model="condition.tasks" placeholder="请选择" style="width:342px;margin-right: 10px" v-show="condition.type=='按钮选择'||condition.type=='节点来源'||condition.type=='退回来源'">
                  <el-option v-for="item in taskList" :key="item.value" :label="item.label+'('+item.value+')'" :value="item.value"></el-option>
                </el-select>
                <el-button type="primary" icon="el-icon-minus" @click="removeCondition(lineData.condition,indexs)"></el-button>
              </div>
            </el-col>
          </el-row>
          <hr style="margin-top: -20px;margin-bottom: 20px" />
        </div>
      </el-form>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" @click="save">保存分支</el-button>
      <el-button type="primary" plain  @click="isVisiable=false">取消</el-button>
    </span>
  </el-dialog>
</template>

<script>
import {getObj, putObj} from '@/api/workflow/wfflowconfig'
import { Message } from "element-ui";

export default {
  data() {
    return {
      isVisiable: false,
      mainInfo: {},
      flowConfigGateway: {},
      gatewayId: "",
      gatewayData: {},
      formField: [],
      taskList: [],
      gatewayInfo: {
        gatewayId: "", //分支编号
        gatewayType: "", //分支分类
        lineData: [
          //线路数据
          // {
          //     lineId:"",//线路ID
          //     taskId:"",//节点ID
          //     taskName:"",//节点名称
          //     firstValue:0,//优先值
          //     condition:[//条件表达式
          //         {
          //             type:"",//条件类型（表单参数、角色参数、职务参数、节点来源）
          //             field:"",//字段
          //             operator:"",//运算符(>、>=、==、<=、<、in、like)
          //             value:"",//值
          //             roles:[],//角色IDS
          //             jobs:[],//职务NAMES
          //             tasks:"",//节点来源IDS
          //             connect:""//连接条件（和、或）
          //         }
          //     ]
          // }
        ]
      },
      roleData: [], //职务参数
      jsData: [] //角色数据
    };
  },
  created: function () { },
  mounted() { },
  methods: {
    init(id, gatewayId, gatewayData) {
      this.mainInfo = {};
      this.gatewayId = gatewayId;
      this.gatewayData = gatewayData;
      this.gatewayInfo = {
        gatewayId: "",
        gatewayType: "",
        lineData: [
          // {
          //     lineId:"",//线路ID
          //     taskId:"",//节点ID
          //     taskName:"",//节点名称
          //     firstValue:0,//优先值
          //     condition:[//条件表达式
          //         {
          //             type:"",//条件类型（表单参数、角色参数、职务参数、节点来源）
          //             field:"",//字段
          //             operator:"",//运算符(>、>=、==、<=、<、in、like)
          //             value:"",//值
          //             roles:[],//角色IDS
          //             jobs:[],//职务NAMES
          //             tasks:"",//节点来源IDS
          //             connect:""//连接条件（和、或）
          //         }
          //     ]
          // }
        ]
      };
      getObj(id)
        .then(res => {
          if (res.data.code == "0") {
            this.mainInfo = res.data.data;
            this.isVisiable = true;
            if (this.mainInfo.flowConfigGateway) {
              this.flowConfigGateway = JSON.parse(
                this.mainInfo.flowConfigGateway
              );
              if (this.flowConfigGateway[gatewayId] != undefined) {
                for (var i in this.flowConfigGateway[gatewayId]) {
                  //this.gatewayInfo[i] = this.flowConfigGateway[gatewayId][i];
                }
              }
            }
            this.gatewayInfo.gatewayId = gatewayData.id;

            var flowConfigLine = JSON.parse(this.mainInfo.flowConfigLine);
            var gateway = flowConfigLine[gatewayId];
            this.gatewayInfo.gatewayType =
              gateway.types == "parallelGateway"
                ? "并行条件分支"
                : "独行条件分支";

            for (var i in gateway.outgoing) {
              var outgoing = gateway.outgoing[i];
              var lineData = {
                lineId: outgoing, //线路ID
                nextType:
                  flowConfigLine[flowConfigLine[outgoing].targetRef].type,
                taskId: flowConfigLine[flowConfigLine[outgoing].targetRef].id, //节点ID
                taskName:
                  flowConfigLine[flowConfigLine[outgoing].targetRef].type ==
                    "endEvent"
                    ? "结束点"
                    : flowConfigLine[flowConfigLine[outgoing].targetRef].name, //节点名称
                firstValue: 0, //优先值
                condition: [
                  //条件表达式
                  // {
                  //     type:"",//条件类型（表单参数、角色参数、职务参数、节点来源）
                  //     field:"",//字段
                  //     operator:"",//运算符(>、>=、==、<=、<、in、like)
                  //     value:"",//值
                  //     roles:[],//角色IDS
                  //     jobs:[],//职务NAMES
                  //     tasks:"",//节点来源IDS
                  //     connect:""//连接条件（和、或）
                  // }
                ]
              };
              if (this.flowConfigGateway[gatewayId] != undefined) {
                var lineDataS = this.flowConfigGateway[gatewayId].lineData;
                for (var j in lineDataS) {
                  if (lineDataS[j].lineId == lineData.lineId) {
                    lineData.condition = lineDataS[j].condition;
                    lineData.firstValue = lineDataS[j].firstValue;
                  }
                }
              }
              this.gatewayInfo.lineData.push(lineData);
            }
            //表单参数
            this.taskList = [];
            for (var x in flowConfigLine.Task) {
              this.taskList.push({
                value: flowConfigLine.Task[x],
                label: flowConfigLine[flowConfigLine.Task[x]].name
              });
            }
            //节点来源
            this.formField = [];
            var formInfo = JSON.parse(this.mainInfo.formInfo);
            for (var x in formInfo) {
              this.formField.push({
                value: formInfo[x].name,
                label: formInfo[x].comment
              });
            }
            // //职务参数
            // fetch.get("/api/system/dictionary/group?dicGroup=rszw").then(res => {
            //   if (res.code == "0") {
            //     this.roleData = [];
            //     for (var items in res.data) {
            //       if (res.data[items].dicZt == "1") {
            //         this.roleData.push({
            //           label: `${res.data[items].dicName}`,
            //           value: `${res.data[items].dicName}`
            //         });
            //       }
            //     }
            //   }
            // });
            // //角色参数
            // fetch.get("/api/system/role").then(res => {
            //   if (res.code == "0") {
            //     this.jsData = [];
            //     for (var items in res.data) {
            //       this.jsData.push({
            //         label: `${res.data[items].roleName}`,
            //         value: `${res.data[items].roleId}`
            //       });
            //     }
            //   }
            // });
          } else {
            this.$message({
              type: "error",
              message: res.msg
            });
          }
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "操作错误"
          });
        });
    },
    addCondition(ar) {
      ar.push({
        type: "", //条件类型（表单参数、角色参数、职务参数、节点来源）
        field: "", //字段
        operator: "", //运算符(>、>=、==、<=、<、in、like)
        value: "", //值
        roles: [], //角色IDS
        jobs: [], //职务NAMES
        tasks: "", //节点来源IDS
        connect: "" //连接条件（和、或）
      });
    },
    removeCondition(ar, i) {
      ar.splice(i, 1);
    },
    save() {
      this.gatewayInfo.lineData.sort(function (a, b) {
        return b.firstValue * 1 - a.firstValue * 1;
      });
      //验证
      var num = 0;
      var yzMessage = "";
      for (var index in this.gatewayInfo.lineData) {
        var data = this.gatewayInfo.lineData[index];
        if (data.condition == "") {
          num += 1;
        } else if (yzMessage == "") {
          for (var index1 in data.condition) {
            var djgtj = parseInt(index1) + 1;
            if (data.condition[index1].type == "") {
              yzMessage =
                "请补全" + data.taskName + "线路第" + djgtj + "个条件";
              break;
            } else {
              var tjpd = "";
              if (
                data.condition[index1].type == "职务参数" &&
                data.condition[index1].jobs == ""
              ) {
                var tjpd = "符合";
                // }else if(data.condition[index1].type=="表单参数"&&(data.condition[index1].field==""||data.condition[index1].operator==""||data.condition[index1].value=="")){
              } else if (
                data.condition[index1].type == "表单参数" &&
                (data.condition[index1].field == "" ||
                  data.condition[index1].operator == "")
              ) {
                var tjpd = "符合";
              } else if (
                data.condition[index1].type == "角色参数" &&
                data.condition[index1].roles == ""
              ) {
                var tjpd = "符合";
              } else if (
                data.condition[index1].type == "按钮选择" &&
                data.condition[index1].tasks == ""
              ) {
                var tjpd = "符合";
              } else if (
                data.condition[index1].type == "节点来源" &&
                data.condition[index1].tasks == ""
              ) {
                var tjpd = "符合";
              } else if (
                data.condition[index1].type == "退回来源" &&
                data.condition[index1].tasks == ""
              ) {
                var tjpd = "符合";
              }
              if (tjpd != "") {
                yzMessage =
                  "请补全" + data.taskName + "线路第" + djgtj + "个条件";
                break;
              }
            }
          }
        }
      }
      if (yzMessage != "") {
        Message({
          message: yzMessage,
          type: "error",
          duration: 3 * 1000
        });
        return;
      }
      if (num == 0) {
        Message({
          message: "请在分支配置中保留一个线路条件为空",
          type: "error",
          duration: 3 * 1000
        });
        return;
      } else if (num > 1 && this.gatewayInfo.gatewayType == "独行条件分支") {
        Message({
          message: "请补全线路条件",
          type: "error",
          duration: 3 * 1000
        });
        return;
      }
      this.flowConfigGateway[this.gatewayId] = this.gatewayInfo;
      //.sort(function(a, b) {return b.firstValue * 1 - a.firstValue * 1; })
      //增加表单验证...
      this.$confirm("此操作将保存该分支的配置信息, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          putObj({
              id: this.mainInfo.id,
              flowConfigGateway: JSON.stringify(this.flowConfigGateway, null, 2)
            })
            .then(res => {
              if (res.data.code == "0") {
                Message({
                  message: "配置信息保存成功...",
                  type: "success",
                  duration: 3 * 1000
                });
                this.isVisiable=false;
              } else {
                Message({
                  message: res.msg,
                  type: "error",
                  duration: 3 * 1000
                });
              }
            })
            .catch(error => {
             //console.log(error);
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消操作"
          });
        });
    }
  }
};
</script>

<style>
.gatewaysz .el-dialog__body {
  height: 480px;
}
.containers {
  overflow: auto;
  padding: 10px;
}
</style>
